<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Title</title>
		<link rel="stylesheet" href="../../lib/layui/css/layui.css" media="all">
	</head>
	<body>
		<form class="layui-form" action="">
			<div class="layui-form-item" style="padding-top: 20px;">
				<label class="layui-form-label">经办者编号</label>
				<div class="layui-input-inline">
					<input type="text" name="handleId" id="handleId" placeholder="请输入标题" autocomplete="off"
						class="layui-input">
				</div>
				<button class="layui-btn" lay-submit lay-filter="formDemo">检索</button>
				<button class="layui-btn" type="button" name="purchasingplanAdd" id="purchasingplanAdd">采购计划</button>
			</div>
		</form>
		<table id="demo" lay-filter="test"></table>

		<script src="../../layui/layui.js"></script>
		<script src="../../js/User.js" type="text/javascript" charset="utf-8"></script>
		<script>
			layui.use(['table', 'form'], function() {
				var table = layui.table;
				var $ = layui.$;
				var form = layui.form;
				//第一个实例
				table.render({
					elem: '#demo',
					height: 312,
					url: globalData.server + 'Alarm/getAllAlarm' //数据接口
						,
					page: true //开启分页
						,
					cols: [
						[ //表头
							{
								field: 'alarmId',
								title: '报警编号',
								width: 100,
								sort: true,
								fixed: 'left'
							}, {
								field: 'handleId',
								title: '经办者编号',
								width: 100
							}, {
								field: 'alarmDate',
								title: '报警时间',
								width: 250,
								templet:"<div>{{!d.alarmDate?'':layui.util.toDateString(d.alarmDate,'yyyy-MM-dd HH:mm:ss')}}</div>"
							}, {
								field: 'remarks',
								title: '备注',
								width: 100
							},
							
							/* //里的toolbar值是模板元素的选择器 */

						]
					]
				});
				$.getJSON("/Alarm/getAllAlarm", function(obj) {
					if (obj.count > 0) {
						for (var i = 0; i < obj.data.length; i++) {
							$("#handleId").append(
								new Option(obj.data[i].handleId,
									obj.data[i].alarmDate))
						}
						form.render('select');
					}

				})
				//监听搜索
				form.on('submit(formDemo)', function(data) {
					//上述方法等价于
					table.reload('demo', {
						where: { //设定异步数据接口的额外参数，任意设
							handleId: data.field.handleId
						}
					}); //只重载数据
					return false;
				});
				$("#purchasingplanAdd").on('click',function(){
								layer.open({
										type : 2,
										content : 'purchasingplanAdd.html', //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
										title : '添加',
										area : [ '500px', '600px' ],
										end : function() {
											window.location.reload();
										}
									});
							})
			});
		</script>
	</body>
</html>
